<template>
  <div style="padding:30px;" >
    <el-alert  :closable="false"  type="info" effect="light" >
    <h1>工单标题：</h1>
    </el-alert>
    
    <el-card class="boxcard">
      <h1>Hello</h1>
    </el-card>
    <quill-editor class="quill-editor" v-model="content" ref="myQuillEditor" style="height: 200px" :options="editorOption">
      </quill-editor>
      <div class="button"  >
        <el-button  type="primary" @click="onSubmit">Create</el-button>
        <el-button @click="onCancel">Cancel</el-button>
      </div>
    <!-- <router-view/> -->
  </div>
</template>

<script>
import {
    quillEditor
  } from 'vue-quill-editor'
  import 'quill/dist/quill.core.css'
  import 'quill/dist/quill.snow.css'
  import 'quill/dist/quill.bubble.css'
export default {
     name:'FuncFormsEdit',
    components:{
      quillEditor
    },
    data(){
      return{
        content:null,
      editorOption:{},
      }
    },
     methods: {
    onSubmit() {
      this.$message('submit!')
    },
    onCancel() {
      this.$message({
        message: 'cancel!',
        type: 'warning'
      })
    }
  }
}
</script>

<style>
.boxcard{
  margin-top: 40px;
  margin-bottom: 40px;
  height: 500px;
}
.quill-editor{
  line-height: normal;
}
.button{
  padding-top:70px;
  margin-left:690px;
}
</style>